<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>股票板块涨幅折线图</title>
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
</head>
<body>
    <canvas id="stockChart"></canvas>
    <script>
        fetch('/api/v1/stock-data')
            .then(response => response.json())
            .then(data => {
                const ctx = document.getElementById('stockChart').getContext('2d');
                new Chart(ctx, {
                    type: 'line',
                    data: {
                        labels: data.dates,
                        datasets: data.datasets
                    },
                    options: {
                        responsive: true,
                        scales: {
                            x: { title: { display: true, text: '日期' } },
                            y: { title: { display: true, text: '涨幅百分比' } }
                        }
                    }
                });
            });
    </script>
</body>
</html>